﻿<mockups:WindowsPhoneChrome 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mockups="clr-namespace:Microsoft.Expression.Prototyping.WindowsPhone.Mockups;assembly=WindowsPhone.Mockups"
    xmlns:pc="http://schemas.microsoft.com/prototyping/2010/controls"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:pi="http://schemas.microsoft.com/prototyping/2010/interactivity"
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    xmlns:SampleData="clr-namespace:Expression.Blend.SampleData.SamplePlaylistSongs" xmlns:local="clr-namespace:ToyundaPhonePrototypeScreens"
    mc:Ignorable="d"
    x:Class="ToyundaPhonePrototypeScreens.Playlist"
    x:Name="PhoneChrome">
	<mockups:WindowsPhoneChrome.Resources>
		<SampleData:SamplePlaylistSongs x:Key="SamplePlaylistSongs" d:IsDataSource="True"/>
	</mockups:WindowsPhoneChrome.Resources>
    <i:Interaction.Triggers>
    	<i:EventTrigger EventName="OrientationChanged">
    		<i:Interaction.Behaviors>
    			<ei:ConditionBehavior>
    				<ei:ConditionalExpression>
    					<ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
    						RightOperand="Landscape" />
    				</ei:ConditionalExpression>
    			</ei:ConditionBehavior>
    		</i:Interaction.Behaviors>
    		<mockups:GoToStateAction StateName="Landscape"
    			TargetObject="{Binding ElementName=LayoutRoot}"
    			TargetName="LayoutRoot" />
    	</i:EventTrigger>
    	<i:EventTrigger EventName="OrientationChanged">
    		<i:Interaction.Behaviors>
    			<ei:ConditionBehavior>
    				<ei:ConditionalExpression>
    					<ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
    						RightOperand="Portrait" />
    				</ei:ConditionalExpression>
    			</ei:ConditionBehavior>
    		</i:Interaction.Behaviors>
    		<mockups:GoToStateAction StateName="Portrait"
    			TargetObject="{Binding ElementName=LayoutRoot}"
    			TargetName="LayoutRoot" />
    	</i:EventTrigger>
    </i:Interaction.Triggers>

    <mockups:WindowsPhoneChrome.BackButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
            	<i:EventTrigger EventName="Click">
            		<pi:NavigateBackAction />
            	</i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/back.png" />
        </Button>
    </mockups:WindowsPhoneChrome.BackButton>

    <mockups:WindowsPhoneChrome.HomeButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
            	<i:EventTrigger EventName="Click">
            		<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.Home" />
            	</i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/home.png" />
        </Button>
    </mockups:WindowsPhoneChrome.HomeButton>

    <mockups:WindowsPhoneChrome.SearchButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
            	<i:EventTrigger EventName="Click">
            		<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.Search" />
            	</i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/search.png" />
        </Button>
    </mockups:WindowsPhoneChrome.SearchButton>

    <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource SamplePlaylistSongs}}">
    	<Grid.RowDefinitions>
    		<RowDefinition Height="Auto"/>
    		<RowDefinition/>
    		<RowDefinition Height="Auto"/>
    	</Grid.RowDefinitions>
        <VisualStateManager.CustomVisualStateManager>
            <ei:ExtendedVisualStateManager />
        </VisualStateManager.CustomVisualStateManager>
        <VisualStateManager.VisualStateGroups>
        	<VisualStateGroup x:Name="CommonStates"
        		ei:ExtendedVisualStateManager.UseFluidLayout="True">
        		<VisualState x:Name="Portrait" />
        		<VisualState x:Name="Landscape">
        			<Storyboard>
        				<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(WindowsPhoneChrome.PageOrientation)"
        					Storyboard.TargetName="PhoneChrome">
        					<DiscreteObjectKeyFrame KeyTime="0">
        						<DiscreteObjectKeyFrame.Value>
        							<mockups:PageOrientation>Landscape</mockups:PageOrientation>
        						</DiscreteObjectKeyFrame.Value>
        					</DiscreteObjectKeyFrame>
        				</ObjectAnimationUsingKeyFrames>
        			</Storyboard>
        		</VisualState>
        	</VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    	<StackPanel HorizontalAlignment="Left" VerticalAlignment="Top" Style="{StaticResource TitlePanelStyle}">
    		<TextBlock Style="{StaticResource TitleBlockStyle}"/>
    		<TextBlock Text="&lt;PLAYLIST NAME&gt;" Style="{StaticResource PhoneTextTitle1Style-Sketch}" Margin="9,-7,12,0"/>
    	</StackPanel>
    	<local:SongListComponent Margin="12,0" d:IsPrototypingComposition="True" Grid.Row="1"/>
    	<mockups:ApplicationBarMockup d:LayoutOverrides="Height" Grid.Row="2">
    		<mockups:ApplicationBarMockup.IconButtonsContent>
    			<StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
    				<mockups:ApplicationBarIconButton Content="Add" ImageSource="/AppBarIcons/add.png">
    					<i:Interaction.Triggers>
    						<i:EventTrigger EventName="Click">
    							<pi:NavigateToScreenAction TargetScreen="ToyundaPhonePrototypeScreens.SongSearch"/>
    						</i:EventTrigger>
    					</i:Interaction.Triggers>
    				</mockups:ApplicationBarIconButton>
    				<mockups:ApplicationBarIconButton Content="Delete" ImageSource="/AppBarIcons/delete.png">
    					<i:Interaction.Triggers>
    						<i:EventTrigger EventName="Click">
    							<pi:NavigateBackAction/>
    						</i:EventTrigger>
    					</i:Interaction.Triggers>
    				</mockups:ApplicationBarIconButton>
    			</StackPanel>
    		</mockups:ApplicationBarMockup.IconButtonsContent>
    		<mockups:ApplicationBarMockup.MenuItemsContent>
    			<StackPanel/>
    		</mockups:ApplicationBarMockup.MenuItemsContent>
    	</mockups:ApplicationBarMockup>
    </Grid>
</mockups:WindowsPhoneChrome>
